import QtQuick 2.12
import QtQuick.Window 2.12
import SerialPort 1.0
//import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
import QtQml 2.12
import NetFun 1.0
import "ajax.js" as Ajax
import QtQuick.Controls.Styles 1.4

import QtQuick.Controls 1.4
import QtGraphicalEffects 1.0
Window {
    id:root
    width: 1600
    height: 900
    visible: true
    title: qsTr("绿来科技")
    property var date: new Date()
    SerialPort{

        id:serialport;
        onSendSerialInfo: {
            console.info(info)
            var myjson ={info}
            serialList.append(myjson)
        }
    }
    NetFun{
        id:mySend
    }

    ListModel {
        id:serialList
    }
    function getTime(value)
    {
//        date.setTime(value)
//        console.info(value,Qt.formatDateTime(date, "mm:ss"))
//        let h = value / 3600
//        if (h >= 1) {
//            if (h < 10) {
//                return "0" + Math.floor(h) + ":" + Qt.formatDateTime(date, "mm:ss")
//            } else {
//                return Math.floor(h) + ":" + Qt.formatDateTime(date, "mm:ss")
//            }
//        } else {
//            return "00:"+Qt.formatTime(date, "mm:ss")
//        }
        let h = value / 3600
        let ms = value % 3600
        let m = ms / 60
        let s = value % 60
        var strh = Math.floor(h)
        if(h < 10)
            strh = "0" + strh;
        var strm = Math.floor(m)
        if(m < 10)
            strm = "0" + strm;
        var strs = s
        if(s < 10)
            strs = "0" + strs;
        return strh + ":" + strm + ":" + strs;
    }
    Rectangle{
        id:message
//        visible: false
//        color: "gray"
        height: parent.height /2
        anchors{
            left: parent.left
            leftMargin: 4
            right: parent.right
            rightMargin: 4
            top: parent.top
            topMargin: 4

        }
        border.color: "orange"
        border.width: 2
            Label{
                text: "时间"
                x:parent.width /6
                y:root.height / 8
                font.pixelSize: 40
                color: "blue"
            }
            Label{
                id:msgTime
                x:parent.width /6 * 2
                y:root.height / 8
                font.pixelSize: 40
                text: "00:00:00"
                color: "blue"
            }

            Label{
                x:parent.width /6 * 3
                y:root.height / 8
                font.pixelSize: 40
                text: "速度km/h"
                color: "blue"
            }
            Label{
                x:parent.width /6 * 4
                y:root.height / 8
                font.pixelSize: 40
                id:msgSpeed
                text: "0.0"
                color: "blue"
            }

            Label{
                x:parent.width /6
                y:root.height / 4
                font.pixelSize: 40
                text: "里程m"
                color: "blue"
            }
            Label{
                id:msgOdom
                x:parent.width /3
                y:root.height / 4
                text: "0.0"
                font.pixelSize: 40
                color: "blue"
            }

            Label{
                x:parent.width /2
                y:root.height / 4
                text: "卡路里CAl"
                font.pixelSize: 40
                color: "blue"
            }
            Label{
                id:msgCalorie
                x:parent.width / 3 * 2
                y:root.height / 4
                text: "0.0"
                font.pixelSize: 40
                color: "blue"
            }

            Label{
                text: "瞬时功率W"
                x:parent.width / 8
                y:root.height / 8 *3
                font.pixelSize: 40
                color: "blue"
            }
            Label{
                id:msgPower
                x:parent.width / 4
                y:root.height / 8 *3
                text: "0.0"
                font.pixelSize: 40
                color: "blue"
            }

            Label{
                text: "总储能mAh"
                x:parent.width / 8 * 3
                y:root.height / 8 * 3
                font.pixelSize: 40
                color: "blue"
            }
            Label{
                id:msgEnergy
                x:parent.width /  2
                y:root.height / 8 *3
                text: "0.0"
                font.pixelSize: 40
                color: "blue"
            }
            Label{
                text: "进度"
                x:parent.width / 8 * 5
                y:root.height / 8 * 3
                font.pixelSize: 40
                color: "blue"
            }
//            Label{
//                id:baifen
//                x:parent.width / 4 * 3 + 130
//                y:root.height / 8 *3 - 40
//                text: (bfb*100).toFixed(2) + "%"
//                font.pixelSize: 40
//                color: "blue"
//            }
            ProgressBar {
                id: progressBar3
                x:parent.width / 4 * 3
                y:root.height / 8 *3
                width: 260
                height: 40
                value: bfb;
                style: ProgressBarStyle{
                    id:progressBar3Style;
                    background: Rectangle{
                        border.width: 1;
                        border.color: control.hovered?"green":"#25b1e8";
                        color:"lightgray";
                        Text {
                            anchors.centerIn: parent
                            text: (bfb*100).toFixed(2) + "%"
                            color: "black"
                            font{
                                pixelSize: 36
                            }
                        }
                    }
                    progress: Rectangle{
                        color: "#25b1e8";//
                        clip: true;
                        Rectangle{
                            anchors.left: parent.left;
                            //anchors.top: parent.top;
                            //anchors.bottom: parent.bottom;
                            height: progressBar3.width;
                            width: progressBar3.width;
                            LinearGradient{
                                anchors.fill: parent;
                                gradient: Gradient {
                                    GradientStop {
                                        position: 0.00;
                                        color: "#ffffff";
                                    }
                                    GradientStop {
                                        position: 1.00;
                                        color: "#36d1e8";
                                    }
                                }
                                start:Qt.point(0, 0);
                                end: Qt.point(parent.width, 0);
                            }
                        }
                    }
                    panel: Item{
                        implicitHeight: 20;
                        implicitWidth: 200;
                        Loader{
                            anchors.fill: parent;
                            sourceComponent: background;
                        }
                        Loader{
                            anchors.top: parent.top;
                            anchors.left: parent.left;
                            anchors.bottom: parent.bottom;
                            anchors.margins: 2;
                            width: currentProgress * (parent.width - 4)
                            sourceComponent: progressBar3Style.progress;
                        }
                    }
                }
//            ProgressBar{
//                value: bfb
//                width: 300
//                x:parent.width / 4 * 3
//                y:root.height / 8 *3
//                height: 64
//                Timer{
//                    interval: 1000
//                    repeat: true
//                    running: true
////                    onTriggered: {
////                        if(parent.value < 1.0){
////                            parent.value += 0.1
////                        }else{
////                            stop()
////                        }
////                    }
//                }
////                style: ProgressBarStyle{
////                    background: Rectangle{
////                        border.width: 1;
////                        border.color: "#25b1e8";
////                        color:"lightgray";
////                    }
            }
    }



    Chart1{
        id:mychart
        z:10
        anchors{
            top:message.bottom
            bottom:serialRect.top
            left:parent.left
            right:parent.right
        }
    }

    RowLayout{
        id:serialRect
        anchors.left: parent.left
        anchors.leftMargin: 30
        anchors.bottomMargin: 20
        anchors.rightMargin: 20
        anchors.bottom: parent.bottom
        anchors.right: parent.right
        height: 30
        Label{
            text:qsTr("串口")
        }
        ComboBox{
            id:port;
            model: serialList
        }

        Button{
            text: qsTr("刷新")

            onClicked: {
                serialList.clear()
                var str = serialport.getSerialInfo();
                console.info(str)
                if(serialList.count !== 0)
                {
                    port.currentIndex = 0
                }
            }
        }
        Button{
            id:serOpen
            text: qsTr("打开串口")
            onClicked: {
//                 serialport.serialConnect(port.currentText);
                if(serialport.isOpen())
                {
                    serOpen.text = "打开串口";
                    serialport.serialClose();
                }
                else
                {
                    serOpen.text = "关闭串口";
                    serialport.serialConnect(port.currentText);

                }
                console.info(serialport.isOpen())
            }
        }
        Button{
            text: qsTr("复位")
            onClicked: {
                msgTime.text = "00:00:00"
                msgSpeed.text = "0.0"
                msgOdom.text = "0.0"
                msgCalorie.text = "0.0"
                msgPower.text = "0.0"
                msgEnergy.text = "0.0"
                secondNum = 0
                secMin = 0
                speed = 0.00
                odom = 0.00
                energy = 0.00
                calorie = 0.00
                power = 0.0
                bfb = 0.0
            }
        }
        Button{
            text: qsTr("上传")
            onClicked: {
//                Qt.quit()
                var myjson = {"enery":energy/14}
                var jsonStr =JSON.stringify(myjson)
                mySend.sendPost(jsonStr)

                msgTime.text = "00:00:00"
                msgSpeed.text = "0.0"
                msgOdom.text = "0.0"
                msgCalorie.text = "0.0"
                msgPower.text = "0.0"
                msgEnergy.text = "0.0"
                secondNum = 0
                secMin = 0
                speed = 0.00
                odom = 0.00
                energy = 0.00
                calorie = 0.00
                power = 0.0
                bfb =0.0
            }
        }
    }
    property int secondNum: 0
    property int secMin: 0
    property real speed: 0.00
    property real  odom: 0.00
    property real  power: 0.00
    property real  energy: 0.00
    property real  calorie: 0.00
    property real  bfb: 0.0
    Timer{
        id:readMsg
        interval: 200
        repeat: true;
        running: true
        triggeredOnStart: true;
        onTriggered: {
            //            console.info(serialport.isOpen())
            if(!serialport.isOpen())
                return;

            secondNum =secondNum + 1;
            msgTime.text = getTime(Math.floor(secondNum / 5))   //运行时间
            var msg = serialport.serialRead();
            if(msg.length!==0)
            {
                var str2 = msg.replace(/'/g, '"');
                var p1 = str2.indexOf("{")
                var p2 = str2.indexOf("}")
                if(p1 === -1 || p2 === -1)
                    return
                if(p1 > p2 && str2.slice(-1)!=="}")
                    return
                if (p2<p1 && str2.slice(-1)==="}")
                    p2 = str2.length
                else
                    p2 = p2 + 1
//                console.info(p1,p2,str2.substring(p1,p2))
//                console.info(str1)
                var str1 = str2.substring(p1,p2);
                console.info(str1)
                try{
                    var djson = JSON.parse(str1)
                    if(djson["speed"] === 0 && djson["power"] !== 0)
                    {
                        speed = Math.sqrt(djson["power"]) * 5
                        power = djson["power"]
                    }
//                    else if(djson["speed"] !== 0 && djson["power"] === 0)
//                    {
//                        speed = djson["speed"];
//                        power = Math.pow(speed / 5 , 2)
//                    }
                    else
                    {
                        speed = djson["speed"];
                        power = djson["power"]
                    }

                    //msgSpeed.text = djson["speed"].toFixed(2).toString() // v = % * sqrt()

                    msgSpeed.text = speed.toFixed(2).toString()
                    odom = odom + speed / 3.6
                    odom = odom.toFixed(2)
                    msgOdom.text = odom.toString()
                    calorie = calorie + power* 0.97
                    msgCalorie.text = calorie.toFixed(2).toString()
                    msgPower.text = power.toFixed(2)
                    energy =  energy + power
                    var energy1 = energy / 14
                    msgEnergy.text = energy1.toFixed(2).toString()
                    bfb = energy1 / 1821

                    mychart.updateChart(speed.toFixed(2),power.toFixed(2))
                }catch(e){
                    console.info(e)
                }
            }
        }
    }
    Component.onCompleted: {
        serialport.getSerialInfo();
        if(serialList.count !== 0)
        {
            port.currentIndex = 0
        }
    }
}
